var frame = (function(data) {
	return {
		title: function(data) {
			var node = data.node;
			node.innerHTML = buildTitle("大东电玩城后台操作系统");
		},
		header: function(data) {
			var node = data.node;
			var account = window.localStorage.account;
			node.innerHTML = buildHeader(account);
			document.getElementById("logout").addEventListener('tap', function() {
				window.location.href = "/logout";
			});
		},
		footer: function(data) {
			var node = data.node;
			var index = data.index;
			node.innerHTML = buildFooter(index);
		}
	}
}());

var buildFooter = function(index) {
	var h = '<nav class="mui-bar mui-bar-tab" style="background: lightblue;"><div class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted" style="background: lightblue;"><div class="mui-scroll">';
	var content1 = buildFooterContent("首页", "/index.html", "", index == 1);
	var content2 = buildFooterContent("账号管理", "/accountSetting.html", "", index == 2);
	var content3 = buildFooterContent("运营管理", "/gameOperate.html", "", index == 3);
	var content4 = buildFooterContent("数据查询", "/dataOperate.html", "", index == 4);
	var content5 = buildFooterContent("测试标签", "#", "", index == 5);
	
	var t = '</div></div></nav>';
	return h + content1 + content2 + content3 + content4 + content5;
}

var buildFooterContent = function(show, href, icon, isActive) {
	var content = '<a class="mui-control-item ' + (isActive ? "mui-active" : "") + '" href="' + href + '"><span class="mui-tab-label">' + show + '</span></a>';
	return content;
}

var buildTitle = function (title) {
	var content = '<div class="mui-bar mui-bar-nav" style="background: lightblue;">				<h1 class="mui-title"><b>'+ title +'</b></h1>			</div>';
	return content;
}

var buildHeader = function(account) {
	var content = '<div class="mui-row" style="background: lightgray;">							<div class="mui-text-center" style="float: left; margin: 20px;"><b>' + account + '</b></div>							<button id="logout" class="mui-btn mui-btn-red we-icon-font icon-logout02" style="float: right; margin: 10px;"></button>						</div>';
	return content;
}
